<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Dojo, javascript, integration, image, switching, rollover, fubar_perl" />
<meta name="description" content="Image switching function using a simple javascript program and Dojo integration!" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta name="distribution" content="Global" />
<meta name="author" content="Dwight Vietzke" />
<meta http-equiv="Reply-to" content="dwight_vietzke@yahoo.com" />
<meta name="classification" content="mobile internet website software" />
<meta name="copyright" content="Copyright©2008-2009 - OpenSiteMobile" />

	<title>Simple Image Switch</title>

<script type="text/javascript" charset='utf-8' src="./msos/dojo_config.js"></script>
<script type="text/javascript" charset='utf-8' src="./dojo/dojo.js"></script>

<script type='text/javascript'>
/* <![CDATA[ */

dojo.require("msos.common");

function init_page() {

	msos.common.switch_img_onmouseover(dojo.byId('icozip'),  'icozip1.gif',  'icozip2.gif');
	msos.common.switch_img_onmouseover(dojo.byId('icoimp'),  'icoimp1.gif',  'icoimp2.gif');
	msos.common.switch_img_onmouseover(dojo.byId('icomail'), 'icomail1.gif', 'icomail2.gif');

	// This section is useful for testing and demo purposes.
	var config_ul = dojo.byId('configuration');
	config_ul.innerHTML = '';	// Clear na ref (for valid xhtml)
	for (var parm in djConfig) {
	    if (typeof(djConfig[parm]) == 'boolean') {
		var list_elm   = document.createElement("li");
		var inpt_elm_t = document.createElement("input");
		var inpt_elm_f = document.createElement("input");
		inpt_elm_t.type = "radio";
		inpt_elm_f.type = "radio";
		inpt_elm_t.name = parm;
		inpt_elm_f.name = parm;
		inpt_elm_t.value = 'true';
		inpt_elm_f.value = 'false';
		if (djConfig[parm])	inpt_elm_t.checked = true;
		else			inpt_elm_f.checked = true;
		var true_txt = document.createTextNode('T ');
		var list_txt = document.createTextNode('F ' + parm); 
		list_elm.appendChild(inpt_elm_t);
		list_elm.appendChild(true_txt);
		list_elm.appendChild(inpt_elm_f);
		list_elm.appendChild(list_txt);
		config_ul.appendChild(list_elm);
	    }
	}
}

// Start our tabs display
dojo.addOnLoad(init_page);

/* ]]> */
</script>

<link rel='stylesheet' type='text/css' charset='utf-8' href="./msos/style/fubar.css" media='screen, handheld' />
<link rel='shortcut icon' href='./msos/images/osm.ico' />

</head>

<body>

<div id='body'>

<div class='marquee'>
    <img id='osm_logo_small' src='./msos/images/osm_logo_sml.jpg' class='marquee_img' alt="OpenSiteMobile" />
</div>

<div class='header'>
<a href='javascript: history.go(-1);' title='Return to the previous page'> Back </a>::
<a href='./index.html' title='Back to index page'> Home </a>
</div>

<h1>Simple Image Switching</h1>

<table class='contrast1'>
<tr><td>Simple Link </td>
    <td><a href='./' title='Link to somewhere else!'>
        <img class='icon_img' src='./msos/images/icozip1.gif'  id='icozip'  alt='Link image to somewhere else!' /></a>
    </td>
</tr><tr>
    <td>Print Link </td>
    <td><a href="javascript:window.print();" title='Print this page'>
        <img class='icon_img' src='./msos/images/icoimp1.gif'  id='icoimp'  alt='Print this page' /></a>
    </td>
</tr><tr>
    <td>Email Link </td>
    <td><a href='mailto:dwight_vietzke@yahoo.com' title='Email us!'>
        <img class='icon_img' src='./msos/images/icomail1.gif' id='icomail' alt="Email us!" /></a>
    </td>
</tr>
</table>

<h3>Page Debugging</h3>

<form accept-charset='utf-8' action='switch_img.html' method='get'>
<div class='list_large'>

<ul id='configuration'><li>Not Available</li></ul>

<input type="submit" value="Reload Page" />

</div>
</form>

<h3>Reference: <a href='./msos/common.js'>msos.common</a></h3>

<div class='list_small'>
<ul>
    <li>switch_img_onmouseover()</li>
    <li>event_debug()</li>
</ul>
</div>

<h3 title='Testing utf-8 encoded characters'>Iñtërnâtiônàlizætiøn</h3>

<div class='footer'>
<a href='javascript: history.go(-1);' title='Return to the previous page'> Back </a>::
<a href='./index.html' title='Back to index page'> Home </a>
</div>

<div id='copyright'>
<span class='no_br'>Powered by:
   <a href='http://www.opensitemobile.com'>
  <span class='bold_text' title="Copyright©2008-2009 OpenSiteMobile - All rights reserved">MobileSiteOS</span></a>™</span>
</div>

</div> <!-- end 'body' div -->

</body>
</html>